<!--
* @Author: 冯尚新 fengshangxin@yunjinhz.com
* @Date:  2024-03-12 19:32:27
* @FilePath: /dev/pages/certificate/official/licWithdrawApply.vue
* @Description: 烟草专卖许可证撤回申请办理登记表

-->
<template>
	<view class="page">
		<!-- #ifdef H5-ONLY -->
		<theme-navbar :is-white="false" :title="navTitle" :custom-back="goBack" style="z-index: 99999">
		</theme-navbar>
		<!-- #endif -->
		<view class="header-list">
			<u-tabs :list="tabList" :show-bar="true" :is-scroll="false" :current="current" @change="handleChange"
				:bold="false"></u-tabs>
		</view>
    	<u-divider bg-color="#f5f5f5" :height="90" half-width="100%"></u-divider>
		<view class="content">
			<view class="content-main" v-show="current == 0">
				<u-form label-width="auto" :rules="rules" :model="docForm" :error-type="['border-bottom', 'message']" class="form-content" ref="uForm">
					<u-form-item label="撤回申请事由" :required="true" prop="withdrawReason" :label-position="labelPosition">
						<u-input type="textarea" placeholder="请填写撤回申请事由" height="120" v-model="docForm.withdrawReason" />
					</u-form-item>
					<u-form-item label="申请人承诺" :required="true" :label-position="labelPosition">
						<u-input type="textarea" height="120" v-model="commitment" disabled />
					</u-form-item>
					<u-form-item label="申请撤回日期" :required="true" prop="applyPersonSignDate" :label-position="labelPosition" right-icon="arrow-right">
						<u-input
						  placeholder="请选择申请撤回日期"
						  class="right-text"
						  :disabled="true"
						  :clearable="false"
						  v-model="docForm.applyPersonSignDate"
						  @click="()=>{clickDateBtn('applyPersonSignDate')}"
						/>
					</u-form-item>
					<u-form-item label="是否同意撤回" :required="true" prop="withdrawAppStatus" :label-position="labelPosition">
						<u-radio-group v-model="withdrawAppStatus" @change="radioGroupChange">
						  <u-radio name="1">同意撤回申请</u-radio>
						  <u-radio name="0">不同意撤回申请</u-radio>
						</u-radio-group>
					</u-form-item>
					<u-form-item label="承办人意见" :required="true" prop="transDecide" :label-position="labelPosition">
						<u-input type="textarea" placeholder="请填写承办人意见" height="120" v-model="docForm.transDecide" />	
					</u-form-item>
					<u-form-item label="承办日期" :required="true" prop="transTime" :label-position="labelPosition" right-icon="arrow-right">
					<u-input
					  placeholder="承办日期"
					  class="right-text"
					  :disabled="true"
					  :clearable="false"
					  v-model="docForm.transTime"
					  @click="()=>{clickDateBtn('transTime')}"
					/>
					</u-form-item>
				</u-form>
			</view>
			<view class="content-main" v-show="current == 1">
				<view class="content-info">
					<u-row gutter="16" align="top" class="divided-line">
						<u-col span="12">
							<view class="msg-title">申请人</view>
							<view class="msg-context">{{ docForm.applyName || "/" }}</view>
						</u-col>
					</u-row>
					<u-row gutter="16" align="top" class="divided-line">
						<u-col span="7">
							<view class="msg-title">联系电话</view>
							<view class="msg-context">{{ docForm.contactTel || "/" }}</view>
						</u-col>
						<u-col span="5">
							<view class="msg-title">证件类型及号码</view>
							<view class="msg-context">{{ docForm.idCardNo || "/" }}</view>
						</u-col>
					</u-row>
					<u-row gutter="16" align="top" class="divided-line">
						<u-col span="7">
							<view class="msg-title">受理单号</view>
							<view class="msg-context">{{ docForm.applyCode || "/" }}</view>
						</u-col>
						<u-col span="5">
							<view class="msg-title">拟撤回的申请类型</view>
							<view class="msg-context">{{ docForm.applyTypeName || "/" }}</view>
						</u-col>
					</u-row>
					<u-row gutter="16" align="top" class="divided-line">
						<u-col span="7">
							<view class="msg-title">许可证类型</view>
							<view class="msg-context">烟草专卖零售许可证</view>
						</u-col>
						<u-col span="5">
							<view class="msg-title">许可证号码</view>
							<view class="msg-context">{{ docForm.licNo || "/" }}</view>
						</u-col>
					</u-row>
					<u-row gutter="16" align="center" class="divided-line">
						<u-col span="10">
							<view class="msg-title">企业名称/个体工商户名称</view>
							<view class="msg-context">{{ docForm.companyName || "/" }}</view>
						</u-col>
					</u-row>
					<u-row gutter="16" align="center" class="divided-line">
						<u-col span="10">
							<view class="msg-title">经营地址</view>
							<view class="msg-context">{{ docForm.businessAddr || "/" }}</view>
						</u-col>
					</u-row>
				</view>
			</view>
		</view>
		<view class="submit-btns btn-other-cls" >
			<u-button plain class="u-btn" type="primary" @click="saveDoc">保存</u-button>
			<u-button class="u-btn" type="primary" @click="saveDoc(submitDoc)">提交</u-button>
    </view>
		<u-calendar mode="date" v-model="isShowDocDate" @change="changeDate($event)"></u-calendar>
	</view>
</template>
<script>
import moment from 'moment'
import { L_APPLY_TYPE } from '@/common/common_enum.js'
import certificateService from '@/service/certificate/certificate.service'

export default {
	name: 'LicWithdrawApply',
	data() {
		return {
			current: 0,
			isShowDocDate: false,
			dateFiled: '',
			L_APPLY_TYPE,
			labelPosition: 'top', 
			tabList: [
				{ name: '撤回申请' },
				{ name: '基本信息' }
			],
			withdrawAppStatus: '1',
			docForm: {// 文书基本信息
				transTime: '', // 承办日期
				transDecide: '同意撤回申请', // 承办人意见
				withdrawReason: '', // 撤回申请事由 
				withdrawAppStatus: true, // 是否撤回
				applyPersonSignDate: '' // 申请撤回日期
			},
			rules: {
				transTime: [
          {
            required: true,
            message: '请选择承办日期',
            trigger: ['change', 'blur']
          }
        ],
        transDecide: [
          {
            required: true,
            message: '请输入承办人意见',
            trigger: ['change', 'blur']
          }
        ],
        withdrawReason: [
          {
            required: true,
            message: '请输入撤回申请事由',
            trigger: ['change', 'blur']
          }
        ],
        applyPersonSignDate: [
          {
            required: true,
            message: '请选择申请撤回日期',
            trigger: ['change', 'blur']
          }
        ]
      },
			commitment: '撤回申请系本人真实的意思表示，本人愿承担由此引起的一切法律责任。'
		}
	},
	onReady() {
    this.$refs.uForm.setRules(this.rules)
  },
	mounted () {
    this.params = this.getRouteParam()
		this.docForm.handleMainUuid = this.params.bizUuid
    this.getDoc()
  },
	methods: {
		// tab页签切换
		handleChange(current) {
			this.current = current
		},
		// 选择日期事件
		clickDateBtn(type) {
			this.isShowDocDate = true
			this.dateFiled = type
		},
		// 申请撤回日期
		changeDate(e) {
			this.docForm[this.dateFiled] = moment(e.result).format('YYYY年MM月DD日')
		},
		// 是否同意撤回
		radioGroupChange(e) {
			this.docForm.withdrawAppStatus = e === '1'
			this.docForm.transDecide = e === '1' ? '同意撤回申请' : '不同意撤回申请'
		},
		// 获取文书基本信息
		getDoc() {
			this.$u.loading('加载中...')
			certificateService.getDoc4Withdraw({
				id: this.params.id,
        docUuid: this.params.docUuid,
				bizUuid: this.params.bizUuid
      }).then(res => {
				this.$u.hideLoading()
				const { success, msg, data = [] } = res
        if (success) {
					this.docForm = { ...this.docForm, ...data[0], ...data[1] }
					this.withdrawAppStatus = this.docForm.withdrawAppStatus ? '1' : '0'
					this.docForm.applyTypeName = this.L_APPLY_TYPE.find(v => v.value === this.docForm.applyType)?.label
        } else {
          this.$u.toast(msg)
        }
      }).catch(err => {
				this.$u.hideLoading()
				this.$u.toast(err)
			})
		},
		// 保存文书
		saveDoc (callback) {
			this.$refs.uForm.validate((valid) => {
				if (!valid) return
				this.$u.loading('正在保存...')
				certificateService.saveDoc4Withdraw({ docUuid: this.params.docUuid, titemUuid: this.params.titemUuid }, this.docForm).then(res => {
					this.$u.hideLoading()
					const { success, msg, bean } = res
					if (success) {
						this.docForm = { ...bean }
						if (callback) {
							callback()
						} else {
							this.$u.toast('保存成功！')
						}
					} else {
						this.$u.toast(msg)
					}
				}).catch(err => {
					this.$u.hideLoading()
					this.$u.toast(err)
				})
			})
		},
		// 提交文书
		submitDoc () {
			this.$refs.uForm.validate((valid) => {
				if (!valid) return
				this.$u.loading('正在提交...')
				certificateService.submitDoc4Withdraw({ docUuid: this.params.docUuid, titemUuid: this.params.titemUuid }, this.docForm).then(res => {
					this.$u.hideLoading()
					const { success, msg } = res
					if (success) {
						this.$u.toast('提交成功！')
						this.backPrev({
							paramKey: "refresh",
							param: true
          	})
					} else {
						this.$u.toast(msg)
					}
				}).catch(err => {
					this.$u.hideLoading()
					this.$u.toast(err)
				})
			})
		}
	}
}
</script>

<style scoped lang="scss">
.page {
	padding: 0;
}
.header-list {
	position: fixed;
	background: white;
	/* #ifdef H5-ONLY  */
	top: 44px;
	/* #endif */
	/* #ifndef H5-ONLY  */
	top: 0px;
	/* #endif */
	left: 0px;
	width: 100%;
	z-index: 999;
	box-sizing: border-box;
}
.content {
	padding: 0 $cm-content-paddng-row 20px;
}
.content-info {
	overflow: hidden;
	padding: 10px;
	background-color: #ffffff;
	border-radius: 5px;
	.msg-title {
		font-size: $cm_form_item_label_font_size;
		color: #717579;
		display: inline;
	}
	.msg-context {
		font-size: $cm_form_item_label_font_size;
		padding: 20rpx 0rpx;
		word-break: break-all;
	}
	.divided-line {
		margin: 0px 0px 20rpx 0px;
	}
	.divided-line::after {
		border-bottom: 2rpx solid #cccccc;
		content: "";
		width: 100%;
		opacity: 0.5;
		display: block;
	}
}
</style>